<style>
  .layui-form-label{
    text-align: left;
  }
</style>
<title>升级添加</title>
<div class="layui-card layadmin-header">
  <div class="layui-breadcrumb" lay-filter="breadcrumb">
    <a lay-href="">主页</a>
    <a><cite>系统管理</cite></a>
    <a><cite>升级管理</cite></a>
    <a><cite>升级添加</cite></a>
  </div>
</div>
<div class="layui-fluid">
  <div class="layui-row layui-col-spacel5">
    <div class="layui-card">
    <div class="layui-card-header">升级添加</div>
    <div class="layui-card-body" style="padding: 15px;">
      <form class="layui-form" action="" lay-filter="component-form-group">
        <div class="layui-form-item layui-form-text">
          <label class="layui-form-label required">App名称</label>
          <div class="layui-input-block">
            <input type="text" name="sign" lay-verify="required" autocomplete="off" placeholder="App名称" class="layui-input">
          </div>
        </div>
        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label required">版本号</label>
            <div class="layui-input-block">
              <input type="number" name="version" lay-verify="required|version" autocomplete="off" placeholder="版本号" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item layui-form-text">
          <label class="layui-form-label">更新时间</label>
          <div class="layui-input-block">
            <input type="text" class="layui-input" name="updateTime" id="test-laydate-type-datetime" placeholder="yyyy-MM-dd HH:mm:ss" lay-key="7">
          </div>
        </div>
        <div class="layui-form-item layui-form-text">
          <label class="layui-form-label">升级内容</label>
          <div class="layui-input-block">
            <textarea name="content" placeholder="升级内容" class="layui-textarea"></textarea>
          </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label required">上传Apk</label>
            <div class="layui-input-block">
              <!--<div class="layui-upload-drag" id="test-upload-drag">
                <i class="layui-icon"></i>
                <p>点击上传，或将文件拖拽到此处</p>
              </div>-->
              <div class="layui-upload">
                <button type="button" class="layui-btn layui-btn-normal" id="test-upload-testList">选择文件</button>
                <div class="layui-upload-list">
                  <table class="layui-table">
                    <thead>
                    <tr><th>文件名</th>
                      <th>大小</th>
                      <th>状态</th>
                      <th>操作</th>
                    </tr></thead>
                    <tbody id="test-upload-demoList"></tbody>
                  </table>
                </div>
                <button type="button" class="layui-btn" id="test-upload-testListAction">开始上传</button>
              </div>
            </div>
        </div>
        <div class="layui-form-item" style="text-align: right">
          <div class="layui-input-block">
            <button class="layui-btn" lay-submit="" lay-filter="component-form-ts-app">立即提交</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            <a lay-href="/menu/list" class="layui-btn layui-btn-primary">
              <i class="layui-icon layui-icon-return"></i>返回
            </a>
          </div>
        </div>
      </form>
    </div>
  </div>
  </div>
</div>
<style>
  .liactive{
    background: #1E9FFF;
  }
</style>
<script>
  var $menuId,$menuName;
layui.use(['admin', 'form', 'laydate','tree','common','upload'], function(){
  var $ = layui.$,admin = layui.admin,element = layui.element
  ,layer = layui.layer
  ,laydate = layui.laydate
  ,form = layui.form,
  upload = layui.upload,
  basePath = layui.common.basePath;
  form.render(null,'component-form-group');
  laydate.render({
    elem: '#LAY-component-form-group-date'
  });
  laydate.render({
    elem: '#test-laydate-type-datetime'
    ,type: 'datetime'
  });
  /* 监听提交 */
  form.on('submit(component-form-ts-app)', function(data){
    var filePathArry = [] ;
    var trList = $("#test-upload-demoList").children("tr");
    for (var i=0;i<trList.length;i++) {
      var filePath = trList.eq(i).attr('filePath');
      filePathArry.push(filePath);
    }
    data.field.addr = JSON.stringify(filePathArry) ; // 将文件绑定到app属性上
    admin.req({
       url: basePath + 'system/tsApp/saveTsApp.do' //实际使用请改成服务端真实接口
      ,data: data.field
      ,type:'post'
      ,done: function(res){
           if(res.code == 0){
             layer.msg(res.msg, {
               offset: '15px'
               ,icon: 1
               ,time: 1000
             }, function(){
               location.hash = '/app/list';
             });
           }else {
             layer.msg(res.msg, {
               offset: '15px'
               , icon: 2
               , time: 1000
             }, function () {
             });
             return ;
           }
      },success:function (res) {
        console.log(res)
      },error:function (res) {
        console.log(res)
      }});
    return false;
  });

  $("body").on("mousedown",".layui-tree a",function(){
    $(".layui-tree a cite").parent().removeClass('liactive') ; //css('color','#333');
    $(this).find('cite').parent().addClass('liactive'); //.css('color','red');
  });


  //多文件列表示例
  var demoListView = $('#test-upload-demoList')
          ,uploadListIns = upload.render({
    elem: '#test-upload-testList'
    ,url: basePath+'base/fileUpload.do'
    ,accept: 'file'
    ,multiple: false // true 是否允许多文件上次
    ,auto: false
    ,number:1 // 设置同时可上传的文件数量，一般配合 multiple 参数出现
    ,bindAction: '#test-upload-testListAction'
    ,choose: function(obj){
      var files = this.files = obj.pushFile(); //将每次选择的文件追加到文件队列
      //读取本地文件
      obj.preview(function(index, file, result){
        var tr = $(['<tr id="upload-'+ index +'">'
          ,'<td>'+ file.name +'</td>'
          ,'<td>'+ (file.size/1014).toFixed(1) +'kb</td>'
          ,'<td>等待上传</td>'
          ,'<td>'
          ,'<button class="layui-btn layui-btn-mini test-upload-demo-reload layui-hide">重传</button>'
          ,'<button class="layui-btn layui-btn-mini layui-btn-danger test-upload-demo-delete">删除</button>'
          ,'</td>'
          ,'</tr>'].join(''));

        //单个重传
        tr.find('.test-upload-demo-reload').on('click', function(){
          obj.upload(index, file);
        });
        //删除
        tr.find('.test-upload-demo-delete').on('click', function(){
          delete files[index]; //删除对应的文件
          tr.remove();
          uploadListIns.config.elem.next()[0].value = ''; //清空 input file 值，以免删除后出现同名文件不可选
        });
        demoListView.append(tr);
      });
    }
    ,done: function(res, index, upload){
      debugger
      if(res.code == 0){ //上传成功
        var tr = demoListView.find('tr#upload-'+ index)
                ,tds = tr.children();
        tds.eq(2).html('<span style="color: #5FB878;">上传成功</span>');
        tds.eq(3).html(''); //清空操作
        tr.attr('filePath',res.data.filePath); // 新增将上传后的文件路径保存起来
        return delete this.files[index]; //删除文件队列已经上传成功的文件
      }
      this.error(index, upload);
    }
    ,error: function(index, upload){
      var tr = demoListView.find('tr#upload-'+ index)
              ,tds = tr.children();
      tds.eq(2).html('<span style="color: #FF5722;">上传失败</span>');
      tds.eq(3).find('.test-upload-demo-reload').removeClass('layui-hide'); //显示重传
    }
  });

});




</script>